<template>
  <a-modal :title="title" v-model="innerVisible" @ok="onConfirm">
    <a-form :form="form" :label-col="{ span: 4 }" :wrapper-col="{ span: 20 }">
      <a-form-item :label="labelText">
        <a-select v-decorator="rule" placeholder="请选择..." >
          <a-select-option v-for="(item,index) in sites" :key="'site-sel-'+index" :value="item">{{ item }}</a-select-option>
        </a-select>
      </a-form-item>
    </a-form>
  </a-modal>
</template>

<script>
import { BindEntranceGetSelects } from '@/api/modular/main/BindEntranceManage'
export default {
  name:'wmsSiteChooseModal',
  emits:['update:visible','confirm'],
  props:{
    type:{
      type:String,
      default:'in'
    },
    visible:{
      type:Boolean,
      default:false
    }
  },
  data(){
    return {
      title:'',
      labelText:'',
      innerVisible:false,
      form: this.$form.createForm(this, { name: 'choose-site-form' }),
      sites:[],
      rule:['site',{rules:[
        { required: true, message: '' }
      ]}]
    }
  },
  watch:{
    visible(newVal,oldVal){
      this.changeInnerVisible()
    },
    innerVisible(newVal,oldVal){
      this.changeVisible()
    }
  },
  methods:{
    changeInnerVisible(){
      if (this.visible!==this.innerVisible){
        this.innerVisible = this.visible
        if (this.innerVisible) {
          this.$nextTick(()=>{
            this.opened()
          })
        }
      }
    },
    changeVisible(){
      if (this.innerVisible!==this.visible){
        this.$emit('update:visible',this.innerVisible)
      }
    },
    opened(){
      this.initText()
      this.getSites()
    },
    initText(){
      if (this.type==='in') {
        this.title="入库口选择"
        this.labelText = "入库口"
        this.rule[1].rules[0].message = "请选择入库口"
      } else {
        this.title="出库口选择"
        this.labelText = "出库口"
         this.rule[1].rules[0].message = "请选择出库口"
      }
    },
    getSites(){
      if (this.sites.length===0) {
        BindEntranceGetSelects().then(d=>{
          this.sites = d.data || []
        }).catch(()=>{
          
        })
      } 
    },
    onConfirm(){
      this.form.validateFields((err, values) => {
        if (!err) {
          this.innerVisible = false;
          this.$emit('confirm',values.site)
        } 
      });
    }
  },
  created(){
    this.changeInnerVisible()
  }
}
</script>

<style>
</style>